import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:laos_mall/common/config/app_const.dart';
import 'package:laos_mall/common/style/app_style.dart';
import 'package:laos_mall/common/style/extension_util.dart';
import 'package:laos_mall/common/widght/appbar_widget.dart';
import 'package:laos_mall/common/widght/image_widget.dart';
import 'package:laos_mall/common/widght/item_widget.dart';
import 'package:laos_mall/common/widght/list_title_widget.dart';

import 'logic.dart';

class PointOrderPage extends StatelessWidget {
  PointOrderPage({Key? key}) : super(key: key);

  final logic = Get.put(PointOrderLogic());

  @override
  Widget build(BuildContext context) {
    var everyW = (ScreenUtil().screenWidth) / 3.0;
    var indicatorLeft = (everyW - 16.w) / 2.0;
    return Scaffold(
      appBar: AppBarWidget(text: "my_point_items".tr),
      body: Column(
        children: [
          TabBar(
            isScrollable: false,
            labelPadding: EdgeInsets.zero,
            indicatorColor: Colors.transparent,
            indicatorPadding: EdgeInsets.only(
                bottom: 10, left: indicatorLeft, right: indicatorLeft),
            tabs: logic.tabBarNames
                .map(
                  (e) => Tab(text: e.tr).addContainer(
                color: Colors.transparent,
                width: everyW,
              ),
            )
                .toList(),
            controller: logic.tabController,
          ),
          TabBarView(
            controller: logic.tabController,
            children: List.generate(3, (index) => PointOrderItemPage(index: index)),
          ).addPadding(EdgeInsets.symmetric(horizontal: 20.w)).addExpand()
        ],
      ),
    );
  }
}

class PointOrderItemPage extends StatefulWidget {
  const PointOrderItemPage({super.key, required this.index});

  final int index;

  @override
  State<PointOrderItemPage> createState() => _PointOrderItemPageState();
}

class _PointOrderItemPageState extends State<PointOrderItemPage> {
  @override
  Widget build(BuildContext context) {
    final logic = Get.find<PointOrderLogic>();

    return ListView.builder(
      itemBuilder: (_, index) {

        return ListTitleWidget(
          rowCrossAxisAlignment: CrossAxisAlignment.start,
          paddingOfLeft: EdgeInsets.only(right: 10.w),
          leading: ImageWidget(url: AppConst.imgUrl,width: 100.w,height: 100.w,fit: BoxFit.fill,),
          maxLeadingW: 100.w,
          title: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
            Text("Laos Vientiane Cinema Movie ticket coupon, for watching ‘Ne Zha 2’...",maxLines: 2,style: AppStyle.textStyle,),
            Text("Laos Vient",style: AppStyle.textSmallStyleLight,).addPadding(EdgeInsets.only(top: 8.h,bottom: 16.h)),
            ItemWidget(mainAxisAlignment: MainAxisAlignment.spaceBetween,prefixItem: Text("pending_use".tr,style: AppStyle.textSmallStyleLight,),suffixItem: AppButton.sizeBtn(() { }, "use_now".tr,size: Size(85.w, 28.h),textStyle: AppStyle.textSmallStyle),)
          ],),showArrow: false,spaceRight: 0,
        ).addContainer(
            color: Colors.transparent,
            margin: EdgeInsets.only(bottom: 20.h,top: index == 0 ? 0: 20.h)).addGestureTap((){
          logic.jumpDetail(index);
        }).addDiver().addOpacity(widget.index == 0 ? 1 : 0.5);
      },
      shrinkWrap: true,
      padding: EdgeInsets.zero,
      itemCount: 4,
    );
  }
}
